<template>

	<el-button>我是 ElButton</el-button>
	<el-table :data="tableData" style="width: 100%">
		<el-table-column prop="id" label="id" width="180" />
		<el-table-column prop="name" label="名字" width="" />
	</el-table>

	<el-pagination @current-change="pagechange" background layout="prev, pager, next" :total="total"
		:page-size="pagesize" />

<br>

	<el-upload v-model:file-list="fileList" class="upload-demo" action="http://localhost:8080/uploaduserimg" multiple>
		<el-button type="primary">选择文件</el-button>
		<template #tip>
			<!-- <div class="el-upload__tip">
				jpg/png files with a size less than 500KB.
			</div> -->
		</template>
	</el-upload>
	
	<br>
	
	<img src="http://localhost:8080/dowload"/>

</template>

<script setup>
	import axios from 'axios';
	import {
		ref,
		onMounted
	} from 'vue';

	const page = ref(1) //当前页
	const size = ref(3) //每页的条数
	const tableData = ref([])
	const total = ref(0) //总条数 
	const pagesize = ref(0) //没有几条
	const fileList = ref([])

	function getUsers() {
		//调后端的接口获取用户分页数据
		axios.get("http://localhost:8080/selectalluser2/" + page.value + "/" + size.value).then(function(res) {
			console.log(res.data)
			tableData.value = res.data.list
			total.value = res.data.total
			pagesize.value = res.data.pageSize
		}).catch(err => {
			console.log(err)
		});
	}

	function pagechange(pg) {
		page.value = pg
		getUsers()
		// alert(page)
	}

	onMounted(() => {
		getUsers()
	})
</script>

<style>
</style>